import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:macnov/stores/signin.dart';
import 'package:macnov/utils/colorUtil.dart';

class MoreBody extends StatelessWidget {
  Widget _rendetAvatar() {
    return Observer(
        builder: (_) => ClipRRect(
            borderRadius: BorderRadius.circular(45),
            child: signInStore.avatarInfo != null
                ? FadeInImage.assetNetwork(
                    width: 90,
                    height: 90,
                    fit: BoxFit.cover,
                    placeholder: 'assets/more/avatar_default.png',
                    image: signInStore.avatarInfo['value'],
                  )
                : (ClipRRect(
                    borderRadius: BorderRadius.circular(45),
                    child: Image.asset(
                      'assets/more/avatar_default.png',
                      width: 90,
                      height: 90,
                      fit: BoxFit.cover,
                    )))));
  }

  Widget _renderCircleHeader(context) {
    return Observer(
      builder: (_) => Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Row(
              children: <Widget>[
                Container(
                  height: 110,
                  padding: EdgeInsets.only(left: 10, top: 20),
                  margin: EdgeInsets.only(bottom: 20),
                  child: _rendetAvatar(),
                ),
                Container(
                  width: 220,
                  padding: EdgeInsets.only(left: 10),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Padding(
                        child: Text(
                            '${signInStore.userInfo.firstName} ${signInStore.userInfo.lastName}',
                            textAlign: TextAlign.left,
                            maxLines: 1,
                            overflow: TextOverflow.fade,
                            style: TextStyle(
                              fontSize: 25,
                              fontWeight: FontWeight.w700,
                            )),
                        padding: EdgeInsets.fromLTRB(0, 10, 0, 10),
                      ),
                      Padding(
                        child: Text('${signInStore.userInfo.email}',
                            maxLines: 1,
                            overflow: TextOverflow.visible,
                            style: TextStyle(color: Colors.black38)),
                        padding: EdgeInsets.fromLTRB(0, 2, 0, 10),
                      ),
                    ],
                  ),
                )
              ],
            ),
            Padding(
              child: Image.asset(
                'assets/more/edit.png',
                width: 28,
                height: 28,
                fit: BoxFit.cover,
              ),
              padding: EdgeInsets.only(right: 10),
            ),
          ]),
    );
  }

  Widget _renderBotCard(context) {
    return new SizedBox(
      child: new Card(
        child: new Column(
          // card只能有一个widget，但这个widget内容可以包含其他的widget
          children: [
            new ListTile(
              onTap: () => this._goLoginOpts(context),
              title: new Text('Login options',
                  style: new TextStyle(fontWeight: FontWeight.w600)),
              leading: Image.asset(
                'assets/more/more_icon_sendfunds.png',
                width: 30,
                height: 30,
              ),
            ),
            new Divider(),
            new ListTile(
              onTap: () => this._goSign(context),
              title: new Text('Logout',
                  style: new TextStyle(fontWeight: FontWeight.w600)),
              leading: Image.asset(
                'assets/more/more_icon_logout.png',
                width: 30,
                height: 30,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _renderCenterCard(context) {
    return new SizedBox(
      child: new Card(
        child: new Column(
          children: [
            new ListTile(
              onTap: () => this._goSendFunds(context),
              title: new Text('Send funds',
                  style: new TextStyle(
                      fontWeight: FontWeight.w600,
                      color: ColorsUtil.hexColor(0x282828))),
              leading: Image.asset(
                'assets/more/funds.png',
                width: 30,
                height: 30,
              ),
            ),
            new Divider(),
            new ListTile(
              onTap: () => this._goRequests(context),
              title: new Text('Requests',
                  style: new TextStyle(
                      fontWeight: FontWeight.w600,
                      color: ColorsUtil.hexColor(0x282828))),
              leading: Image.asset(
                'assets/more/more_icon_requests.png',
                width: 30,
                height: 30,
              ),
            ),
            new Divider(),
            new ListTile(
              onTap: () => this._goAlerts(context),
              title: new Text('Alerts',
                  style: new TextStyle(
                      fontWeight: FontWeight.w600,
                      color: ColorsUtil.hexColor(0x282828))),
              leading: Image.asset(
                'assets/more/more_icon_alerts.png',
                width: 30,
                height: 30,
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: <Widget>[
        InkWell(
          onTap: () => _goProfile(context),
          child: _renderCircleHeader(context),
        ),
        _renderCenterCard(context),
        _renderBotCard(context),
      ],
    );
  }

  void _goProfile(context) {
    Navigator.pushNamed(context, '/profile');
  }

  void _goSign(context) {
    var signOutOk = signInStore.signOut();
    signInStore.needAuth = false;
    Navigator.pushNamedAndRemoveUntil(context, '/', (Route route) => false);
  }

  void _goSendFunds(context) {
    Navigator.pushNamed(context, '/sendfunds');
  }

  void _goRequests(context) {
    Navigator.pushNamed(context, '/requests');
  }

  void _goLoginOpts(context) {
    Navigator.pushNamed(context, '/loginOpt');
  }

  void _goAlerts(context) {
    Navigator.pushNamed(context, '/alerts');
  }
}
